<template>
    <div>
        <h3>{{ msg }}</h3>
        <table>
				<tr>
					<td style="padding:5px;">
						用户名：
					</td>
					<td style="padding:5px;">
						<input type="text" v-model="username">
					</td>
				</tr>
				<tr>
					<td style="padding:5px;">
						密码：
					</td>
					<td style="padding:5px;">
						<input type="password" v-model="password">
					</td>
				</tr>
				<tr>
					<td style="padding:5px;">
						
					</td>
					<td style="padding:5px;">
						<Button @click="submit" color='blue'>登录</Button>
					</td>
				</tr>
			</table>
    </div>
</template>

<script>
export default {
    data () {
        return {
            msg: '登录页',
            username: '',
            password: '',
        }
    },

    // 注册组件
    components: {
        
    },

    //钩子方法
    mounted:function(){

    },

    //自定义方法
    methods:{
        // 提交
	    submit: function () {
            if(this.username == ''){
                this.$Message('用户名不能为空');
                return false;
            }

            if(this.password == ''){
                this.$Message('密码不能为空');
                return false;
            }

            // 发送请求
            this.axios.get('http://127.0.0.1:8000/login/',
            {params: {
                username:this.username,
                password:this.password,
                }}).then((result) =>{
                    console.log(result);
                    this.$Message(result.data.message);
                    if(result.data.code == 200){
                        // 将用户名和id存储到localstorage
                        localStorage.setItem('username', result.data.username);
                        localStorage.setItem('uid', result.data.uid);
                        // 跳转
                        this.$router.push('/goodslist');
                    } 		
            })
	  }
    }
}
</script>

<style>
    
</style>
